<template>
  <el-cascader style="width: 100%;line-height: 35px;" :options="options" :props="props" collapse-tags @change="cascaderChange"
               :placeholder="$t('common.PleaseSelect')" popper-class="cascader-tree" clearable />
</template>

<script>
import recursion from '@/util/recursion'
export default {
  name: 'index',
  data() {
    return {
      props: { multiple: true },
      value: [],
      options: []
    }
  },
  mounted() {
    this.getOrgList()
  },
  methods: {
    cascaderChange(val) {
      let list = []
      val.forEach(item => {
        list.push(item[item.length - 1])
      })
      this.$emit('update:value', list)
    },
    // 获取使用位置
    getOrgList() {
      this.axios({
        method: 'get',
        url: '/basic/organization/findListByToken',
        params: { level: 3 }
      }).then(res => {
        if (res.code === 200) {
          const obj = {
            label: 'name',
            value: 'id',
            children: 'children'
          }
          this.options = recursion.convertTree(res.data, obj)
        } else {
          this.$Message.warning({ content: res.msg, duration: 6, closable: true })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
/deep/ .el-input__inner {
  background: #fff;
  height: 32px !important;
  line-height: 32px;
}
/deep/ .el-cascader__tags .el-tag{
  max-width:70%;
}
</style>
